<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" id="vp" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<title>搜索</title>
		<link href="../../css/style.css" rel="stylesheet" type="text/css">
		<link href="../../css/mui.css" rel="stylesheet" />
		<style type="text/css">
			[v-cloak] {
			   display: none;
			}
		</style>
	</head>
	<script>
	</script>

	<body>

		<div id="search">
			<!--搜索-->
			<header class="mui-bar mui-bar-nav blueBackground" style="background-color: #ffffff!important;">
            <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
					<font class="mui-icon mui-icon-arrowleft" style="color: rgb(119, 119, 119) !important;;"></font>
				</button>
            <div class="top-blue-search main clearfix">
                <font class="mui-icon mui-icon-search top-blue-search-l fl"></font>
                <input type="search" name="" id="txtkey" value="" class="top-blue-search-r fl" style="background-color: #efefef;" placeholder="请输入关键字" />
            </div>
            <button class="search-btn" id="btnsearch" style="color: rgb(119, 119, 119) !important;">搜索</button>
        </header>
			<div id="records" v-cloak>
				<div class="search-hot search-s-pub">
					<div class="search-title">热门搜索</div>
					<ul class="search-s-pub-ul">
						<li v-for="item in hot" @tap="open_list(item)">{{item.name}}</li>
					</ul>
				</div>

				<div class="seaar-list search-s-pub">
					<div class="search-title">
						历史搜索
					</div>
					<ul class="search-s-pub-ul">
						<li v-for="item in past" @tap="open_list(item)">{{item.name}}</li>
					</ul>
				</div>
			</div>

			<script src="../../js/mui.js"></script>
			<script src="../../js/vue.min.js"></script>
			<script src="../../js/jquery-1.8.3.min.js"></script>
			<script src="../../js/app.js"></script>
			<script src="../../js/token.js"></script>
			<script>
				mui.init();
				mui.plusReady(function() {
					initNativeObjects();
					showSoftInput();
					
					var state = app.getState();
					var memberToken = state.memberToken
					var uid = state.userid;
					mui.post(Apiurl+'index/past', { 
						uid: uid,
						memberToken: memberToken
					}, function(data) {
						if(data.status==404){
							records.past = '';
						}else{
							records.past = data;
						}
					}, 'json');
					mui.post(Apiurl+'index/hot', {
						uid: uid,
						memberToken: memberToken
					}, function(data) {
						if(data.status==404){
							records.hot = '';
						}else{
							records.hot = data; 
						}
					}, 'json');
					var records = new Vue({
						el: '#records',
						data: {
							past: [],
							hot: []
						},
						methods: {
							//点击历史/热门标签
							open_list: function(item) {
								mui.openWindow({
									url: 'list.html',
									id: 'search_list',
									extras: {
										keyword: item.name,
										type: "search"
									}
								});
							}
						}
					});
					var btnsearch = document.getElementById('btnsearch');
					var txtkey = document.getElementById('txtkey');
					//监听搜索按钮点击
					btnsearch.addEventListener('tap', function(event) {
						if(!txtkey.value) return false;
						mui.openWindow({
							url: 'list.html',
							id: 'schoolslist',
							extras: {
								type: "search",
								keyword: txtkey.value
							}
						});
					}); 
					//监听回车事件
					txtkey.addEventListener('keyup', function(event) {
						if(!txtkey.value) return false;
						if(event.keyCode == 13) {
							mui.openWindow({
								url: 'list.html',
								id: 'schoolslist',
								extras: {
									type: "search",
									keyword: txtkey.value
								}
							});
						}
					});
				});

				var nativeWebview, imm, InputMethodManager;
				var initNativeObjects = function() {
					if(mui.os.android) {
						var main = plus.android.runtimeMainActivity();
						var Context = plus.android.importClass("android.content.Context");
						InputMethodManager = plus.android.importClass("android.view.inputmethod.InputMethodManager");
						imm = main.getSystemService(Context.INPUT_METHOD_SERVICE);
					} else {
						nativeWebview = plus.webview.currentWebview().nativeInstanceObject();
					}
				};
				var showSoftInput = function() {
					if(mui.os.android) {
						imm.toggleSoftInput(0, InputMethodManager.SHOW_FORCED);
					} else {
						nativeWebview.plusCallMethod({
							"setKeyboardDisplayRequiresUserAction": false
						});
					}
					setTimeout(function() {
						var inputElem = document.getElementById("txtkey");
						inputElem.focus();
					}, 200);
				};
			</script>
	</body>

</html>